<template>
  <div class="hello">
    <div class="header-left">
      <span class="iconfont back-left">&#xe606;</span>
    </div>
    <div class="header-input">
      <span class="iconfont">&#xe612;</span>输入城市/景点/游玩主题
      </div>
    <div class="header-rigth">
      城市
      <span class="iconfont back-right">&#xe64a;</span>
      </div>
  </div>
  <!-- <Hellswiper/> -->
</template>

<script>
// import Hellswiper from "@/components/Hellswiper.vue";
export default {
  name: "HelloWorld",
  components:{
    // Hellswiper
  },
  props: {
    msg: String,
  },
};
</script>
<style scoped lang="less">
.hello{
  display: flex;
  line-height: .86rem;
  color:#fff;
  background-color: #00bcd4;
  .header-left{
    width: .64rem;
    float: left;
    .back-left{
      text-align: center;
      font-size: .4rem;
      margin-left: .2rem;
    }
  }
  .header-input{
    flex: 1;
    color: #ccc;
    height: .64rem;
    line-height: .64rem;
    margin-top: .12rem;
    margin-left:.2rem;
    padding-left: .2rem;
    background-color: #fff;
    border-radius: .1rem;
  }
  .header-rigth{
    width: 1.3rem;
    float: rigth;
    text-align: center;
    .back-right{
      text-align: center;
      margin-left: -.04rem;
    }
  }
}
</style>
